import { LoginOut } from "~/assets/imgs.tsx";
import { AdminState } from "~/routes/admin/_middleware.ts";

export default ((props: AdminState) => {
  return (
    <div class="h-full flex-col flex justify-between">
      <ul>
        <li class=" hover:bg-slate-500">
          <a class="h-full block px-4 py-2" href="/admin">首页</a>
        </li>
        <li class=" hover:bg-slate-500">
          <a class="h-full block px-4 py-2" href="/admin/resume">
            简历分享
          </a>
        </li>
        <li class=" hover:bg-slate-500">
          <a class="h-full block px-4 py-2" href="/admin/message">
            留言
          </a>
        </li>
      </ul>
      <div class="p-4">
        <div class="flex gap-1 items-center">
          <div class="relative inline-block group">
            <img
              class="size-8 rounded-full peer"
              src={props.user.photo || "/default-user-avatar.png"}
              alt="user_picture"
              srcset=""
            />
            <div class="absolute z-10 top-0 left-0 size-8 hidden group-hover:block">
              <a
                href="/admin/loginout"
                title="退出登陆"
                class=" size-full flex items-center bg-opacity-50 bg-orange-500 text-white justify-center rounded-full shadow-md "
              >
                <LoginOut />
              </a>
            </div>
          </div>
        </div>
      </div>
    </div>
  );
});
